<template>
	<el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible">
		<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
			<el-form-item label="供应商" prop="supplierId">
				<el-select v-model="dataForm.supplierId" placeholder="请选择">
					<el-option v-for="item in supplierList" :key="item.id" :label="item.supplierName" :value="item.id"></el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="入库原料" prop="inFactoryRawMeterialList"><el-button @click="getRawList" type="success" icon="el-icon-plus">选择原料</el-button></el-form-item>
			<el-form-item label="原料列表">
				<el-table :data="rawMList" border style="width: 100%;">
					<el-table-column prop="rawMaterialName" header-align="center" align="center" label="原料名称"></el-table-column>
					<el-table-column prop="specs" header-align="center" align="center" label="规格"></el-table-column>
					<el-table-column header-align="center" align="center" label="数量">
						<template slot-scope="scope">
							<el-input v-show="scope.row.sign === 1" v-model="pInfo.rawNumber" placeholder="数量"></el-input>
							<div v-show="scope.row.sign === 0">{{scope.row.rawNumber}}</div>
						</template>
					</el-table-column>
					<el-table-column header-align="center" align="center" label="采购价">
						<template slot-scope="scope">
							<el-input v-show="scope.row.sign === 1" v-model="pInfo.purchasePrice" placeholder="采购价"></el-input>
							<div v-show="scope.row.sign === 0">{{scope.row.purchasePrice}}</div>
						</template>
					</el-table-column>
					<el-table-column header-align="center" align="center" label="总价">
						<template slot-scope="scope">
							<div style="color: red;">￥{{scope.row.rowPrice}}元</div>
						</template>
					</el-table-column>
					<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
						<template slot-scope="scope">
							<el-button type="text" size="small" @click="deleteHandle(scope.row)">删除</el-button>
							<el-button type="text" size="small" @click="updateRow(scope.row)">编辑</el-button>
							<el-button type="text" size="small" @click="saveRow(scope.row)">保存</el-button>
						</template>
					</el-table-column>
				</el-table>
				<div style="text-align: center;color: red;">总计：￥{{totalPrice}}元</div>
			</el-form-item>
			<el-form-item label="实付金额" prop="reallyPayMoney"><el-input v-model="dataForm.reallyPayMoney" placeholder="实付金额"></el-input></el-form-item>
			<el-form-item label="支付方式" prop="payMthod">
				<el-select v-model="dataForm.payMthod" placeholder="支付方式">
					<el-option label="现金" value="现金"></el-option>
					<el-option label="银行卡" value="银行卡"></el-option>
					<el-option label="支付宝" value="支付宝"></el-option>
					<el-option label="微信" value="微信"></el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="其他费用" prop="otherConst"><el-input v-model="dataForm.otherConst" placeholder="其他费用"></el-input></el-form-item>
			<el-form-item label="备注" prop="remark"><el-input v-model="dataForm.remark" placeholder="备注"></el-input></el-form-item>

		</el-form>
		<span slot="footer" class="dialog-footer">
			<el-button @click="visible = false">取消</el-button>
			<el-button type="primary" @click="dataFormSubmit()" :disabled="disabledSubmit">确定</el-button>
		</span>

		<RawType @getRawList="rawList" ref="RawTypeRef"></RawType>

<!-- 		<el-dialog title="修改" :visible.sync="UpdateVisible" append-to-body center width="30%">
			<el-form :model="pInfo" label-width="80px">
				<el-form-item label="原料名称">
					<el-input disabled v-model="pInfo.rawMaterialName" placeholder="原料名称"></el-input>
				</el-form-item>
				<el-form-item label="数量">
					<el-input v-model="pInfo.rawNumber" placeholder="数量"></el-input>
				</el-form-item>
				<el-form-item label="采购价">
					<el-input v-model="pInfo.purchasePrice" placeholder="采购价"></el-input>
				</el-form-item>
			</el-form>
		</el-dialog> -->
	</el-dialog>
</template>

<script>
import RawType from './rawType.vue';
export default {
	components: {
		RawType
	},

	data() {
		return {
			disabledSubmit:false,
			visibles:false,
			rawMList: [],
			rawTypeList: [],
			supplierList: [],
			visible: false,
			dataForm: {
				id: 0,
				sellerId: '',
				supplierId: '',
				purchaseNo: '',
				warehouseId: '',
				inFactoryRawMeterialList: '',
				outFactoryRawMeterialList: '',
				reallyPayMoney: '',
				payMthod: '',
				createUserName: '',
				createTime: '',
				inStatus: '',
				outStatus: '',
				otherConst: '',
				remark: '',
				rawNumber: '',
				purchasePrice: '',
				rowPrice:0
			},
			dataRule: {
				supplierId: [{ required: true, message: '供应商不能为空', trigger: 'blur' }],
				warehouseId: [{ required: true, message: '仓库不能为空', trigger: 'blur' }],
				reallyPayMoney: [{ required: true, message: '实付金额不能为空', trigger: 'blur' }]
			},
			pInfo:{
				rawNumber:'',
				purchasePrice:''
			},
			UpdateVisible:false,
			totalPrice:0
		};
	},

	methods: {
		saveRow(row){
			if( this.pInfo.rawNumber === '' || this.pInfo.purchasePrice === ''){
				this.$message({
					message: '请输入数量或采购价',
					type: 'success',
					duration: 1500,
				});
			}else{
				const arr = []
				this.rawMList.forEach(item => {
					if(row.id == item.id){
						item.sign  = 0
						item.rawNumber = this.pInfo.rawNumber
						item.purchasePrice = this.pInfo.purchasePrice
						item.rowPrice = Number(item.rawNumber)*Number(item.purchasePrice)
						this.totalPrice += Number(item.rowPrice)
						arr.push(item)

					}else{
						arr.push(item)
					}
				})
				this.rawMList = arr
			}

		},

		updateRow(row){
			this.pInfo.rawNumber = row.rawNumber
			this.pInfo.purchasePrice = row.purchasePrice
			const arr = []
			this.rawMList.forEach(item => {
				if(row.id === item.id){
					item.sign  = 1
					arr.push(item)
				}else{
					arr.push(item)
				}
			})
			this.rawMList = arr

		},

		//删除原料
		deleteHandle(row){
			const arr = []
			for(let i = 0 ; i < this.rawMList.length ; i++){
				if(this.rawMList[i].id !== row.id){

					arr.push(this.rawMList[i])
				}
				else{
					this.totalPrice -= Number(row.rowPrice)
				}
			}
			this.rawMList = arr
		},

		rawList(list) {
			list.forEach(item => {
				item.rawNumber = 1
				item.purchasePrice = 0
				item.rowPrice = 0
				item.sign = 0
			})
			this.rawMList = list;
		},

		//入库原料
		getRawList() {
			this.$refs.RawTypeRef.getDataList();
		},

		init(id) {
			//供应商
			this.$http({
				url: this.$http.adornUrl('/store/tstoresupplier/list'),
				method: 'get'
			}).then(({ data }) => {
				if (data && data.code === 0) {
					this.supplierList = data.page.list;
				} else {
					this.supplierList = [];
				}
			});

			this.dataForm.id = id || 0;
			this.visible = true;
			this.$nextTick(() => {
				this.$refs['dataForm'].resetFields();
				if (this.dataForm.id) {
					this.$http({
						url: this.$http.adornUrl(`/factory/tfactorypurchase/info/${this.dataForm.id}`),
						method: 'get',
						params: this.$http.adornParams()
					}).then(({ data }) => {
						if (data && data.code === 0) {
							this.dataForm.sellerId = data.tFactoryPurchase.sellerId;
							this.dataForm.supplierId = data.tFactoryPurchase.supplierId;
							this.dataForm.purchaseNo = data.tFactoryPurchase.purchaseNo;
							this.dataForm.warehouseId = data.tFactoryPurchase.warehouseId;
							this.dataForm.inFactoryRawMeterialList = data.tFactoryPurchase.inFactoryRawMeterialList;
							this.dataForm.outFactoryRawMeterialList = data.tFactoryPurchase.outFactoryRawMeterialList;
							this.dataForm.reallyPayMoney = data.tFactoryPurchase.reallyPayMoney;
							this.dataForm.payMthod = data.tFactoryPurchase.payMthod;
							this.dataForm.createUserName = data.tFactoryPurchase.createUserName;
							this.dataForm.createTime = data.tFactoryPurchase.createTime;
							this.dataForm.inStatus = data.tFactoryPurchase.inStatus;
							this.dataForm.outStatus = data.tFactoryPurchase.outStatus;
							this.dataForm.otherConst = data.tFactoryPurchase.otherConst;
							this.dataForm.remark = data.tFactoryPurchase.remark;
						}
					});
				}
			});
		},
		// 表单提交
		dataFormSubmit() {
			this.disabledSubmit = true
			this.$refs['dataForm'].validate(valid => {
				if (valid) {
					this.$http({
						url: this.$http.adornUrl(`/factory/tfactorypurchase/save`),
						method: 'post',
						data: this.$http.adornData({
							id: this.dataForm.id || undefined,
							//sellerId: this.dataForm.sellerId,
							supplierId: this.dataForm.supplierId,
							inFactoryRawMeterialList: JSON.stringify(this.rawMList),
							//outFactoryRawMeterialList: this.dataForm.outFactoryRawMeterialList,
							reallyPayMoney: this.dataForm.reallyPayMoney,
							totalMoney: this.totalPrice,
							payMthod: this.dataForm.payMthod,
							status: 1,
							otherConst: this.dataForm.otherConst,
							remark: this.dataForm.remark
						})
					}).then(({ data }) => {
						if (data && data.code === 0) {
							this.$message({
								message: '操作成功',
								type: 'success',
								duration: 1500,
								onClose: () => {
									this.visible = false;
									this.disabledSubmit = false
									this.$emit('refreshDataList');
								}
							});
						} else {
              this.disabledSubmit = false
							this.$message.error(data.msg);
						}
					});
				}
        else {
          this.disabledSubmit = false
        }
			});
		}
	}
};
</script>
